<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Title</title>
        <style>
            * {
                padding: 0;
                margin: 0;
            }
            .a {
                width: 200px;
                height: 200px;
                background-color: red;
                margin-bottom: 100px;
            }
            .b {
                width: 300px;
                height: 300px;
                background-color: blue;
                /* 相邻元素之间 垂直margin会重叠，注意：margin-lift和margin-right不会重叠 */
                margin-top: 50px;
            }

        </style>
    </head>
    <body>
    <div class="a"></div>
    <div class="b"></div>

    </body>
</html>